<template>
	<view class="content">
		<view style="width: 100%;height: 150px;background: #195B40;">
			
		</view>
		<form @submit="formSubmit" @reset="formReset"  style="height: auto;width: auto;">
			<view class="input-group" style="border-radius: 14px;margin: -80px 2% 0 2%;width: 96%;">
				<!-- 头像 -->
				<view style="width: 100%;text-align: center;">
					<image src="../../../static/lxr.jpg" mode="" style="width: 50px;height: 50px;margin:-20px 0 0 0;border-radius:8px;"></image>
				</view>
				<view class="titleBox">企业信息</view>
				<view class="input-row  ">
					<m-input class="uni-input" name="company" type="text" clearable focus v-model="paramData.company_name" placeholder="请输入企业名称"></m-input>
				</view>
				<view class="input-row ">
					<m-input class="uni-input" name="companyaddress" type="text" clearable focus v-model="paramData.address" placeholder="请输入企业地址"></m-input>
					<!-- <button type="primary" v-on:click="toPosition" style="height: 40px;line-height: 40px;background: #195B40;">&</button> -->
				</view>
				<view style="margin:0px 10px;font-size: 11px;color: #195B40;">
					访客在距离企业500米内方可进行来访登记,请选择正确的企业地址
				</view>
				<view class="titleBox">负责人信息</view>
				<view class="input-row ">
					<m-input class="uni-input" type="text" name="name" clearable focus v-model="paramData.concact_person" placeholder="请输入您的姓名"></m-input>
				</view>
				<view class="input-row ">
					<!-- <text class="title" style="width: 20%;"><text class="requiedF">*</text>手机号：</text> -->
					<m-input class="uni-input" name='phone' style="width: 70%;float: left;" type="number" clearable focus v-model="paramData.tel" placeholder="请输入手机号"></m-input>
					<button :disabled="phonedisbled" style="float: left;font-size: 12px;line-height: 40px;"  open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">获取手机</button>
				</view>
				<view class="input-row ">
					<m-input class="uni-input" style="width: 60%;float: left;" type="text" clearable focus v-model="paramData.code" placeholder="请输入验证码"></m-input>
					<button style="width: 40%;float: left;font-size: 12px;line-height: 40px;" :disabled="codedisable"  @click="getVCode">获取验证码</button>
				</view>
			</view>
		
		<view class="btn-row" style="bottom: 0;left: 0;right: 0;text-align: center;">
			<button form-type="submit" :disabled="btnDisable" type='primary' style="margin-bottom: 20rpx;background: #195B40;">下一步</button>
			</view>
			<!-- <button type="default" form-type="reset" @tap="formReset">重置</button> -->
			<!-- 吉鼎 -->
			
			</form>
		
		<view style="color: #999999;font-size: 15rpx;">@ 吉鼎(厦门)科技有限公司 提供技术支持</view>
	</view>
</template>



<style scoped>
	.title {
		font-size: 29rpx;
		width: 160rpx;
	}

	.requiedF {
		color: #FF3333;
	}

	.action-row {
		display: flex;
		flex-direction: row;
		justify-content: center;
	}

	.action-row navigator {
		color: #007aff;
		padding: 0 10px;
	}
	.titleBox{
		font-size: 18px;
		margin: 10px;
		color: #666666;
		font-weight: 600;
	}
	.input-row{
		border-radius: 4px;
		border: 1px solid #DDDDDD;
		margin: 10px;
	}
	.input-group::before{
		background: unset;
	}
	.input-group::after{
		background: unset;
	}
</style>
<script>
	import {dataURLtoFile} from '../../../api/index.js'
	import {createWxaQrcode} from '../../../api/index.js'
	import {addCompany} from '../../../api/index.js'
	import $api from '../../../api/index.js'
	import mInput from '../../../components/m-input.vue'
	import {getWxBindMobile} from '../../../api/index.js'
	import {sendShotCode} from '../../../api/index.js'
	var graceChecker = require('../../../common/graceChecker.js');
	import {
		mapMutations
	} from 'vuex';
	export default {
		components: {
			mInput,
			
		},
		data() {
			return {
				paramData:{
					tel: '',
					company_name: '',
					address:'',
					concact_person:'',
					code:''
				},
				VCode:'',
				concact_person:'',
				phonedisbled:false,
				btnDisable:true,
				codedisable:false
			}
		},
		methods: {
			// 获取验证码
			getVCode(){
				var getVCodelist={
								  		 'mobile':this.paramData.tel,
								  		 'key': 'elt_loginCode',
				}
				var retData3=sendShotCode(getVCodelist)
				var that =this
				Promise.resolve(retData3).then(function (result) {
					if(result.code=='0'){
									that.codedisable =true
					}
					 })
			},
			getPhoneNumber(e) {
				  	 var datelist={
				  		 'ivStr':e.detail.iv,
				  		 'session_key': wx.getStorageSync("session_key"),
				  		 'encryptedData':e.detail.encryptedData,
				  		'code':wx.getStorageSync("code"),
				  	 }
					 var retData1=getWxBindMobile(datelist)
					 var that =this
					 // Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: "xx"}
					 Promise.resolve(retData1).then(function (result) { 
					 	if(result.code=='0'){
							that.phonedisbled = true
							that.paramData.tel =result.data.phoneNumber
							// 将电话号码存储
							wx.setStorageSync("tel", result.data.phoneNumber);
					 	}
					 	 })
			    },
			...mapMutations(['login']),
			formSubmit: function(e) {
				
				uni.showLoading({
					title: '注册中...'
				}),
				console.log(this.paramData);
				var retData=addCompany(this.paramData)
				console.log(retData)
				// Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: "xx"}
				Promise.resolve(retData).then(function (result) { 
					console.log(result)
					if(result.code=='0'){
						console.log(result.data.SysId)
						wx.setStorageSync("SysId", result.data.SysId)
						wx.setStorageSync('CompanyList',result.data)
						uni.showModal({
									content: `注册成功`,
									showCancel: false,
									success(res) {
										uni.reLaunch({
											url: '../../manager/stat/stat'
										});
									}
								})
						
					}
					 })
				// let retData = await this.$apis.addCompany(this.paramData);
				// console.log(retData);
				if (retData.code != 0) {
					console.log('321')
				return;
				} else {
					console.log('213')
				}
				// }
			},
			formReset: function(e) {
				// this.username = '';
				this.company_name  = '';
				this.company_address  = '';
				// this.email = '';
				this.phone = '';
				// this.password = '';
				// this.repassword = '';
			},
			// 发送验证码接口
			sendVCode(){
				alert('12321')
			},
			// 定位
			toPosition(){
				alert('321321321321321321')
			},
		},
		mounted() {
			// console.log(wx.getStorageSync("tel"))
			if(wx.getStorageSync("tel") !=''){
				this.paramData.tel =wx.getStorageSync("tel")
				this.phonedisbled =true
			}
			
			// if(wx.getStorageSync("tel"))
		},
		// paramData:{
				// 	tel: '',
				// 	company_name: '',
				// 	address:'',
				// 	concact_person:'',
				// 	code:''
				// },
		watch:{
			'paramData.tel'(newVal){
				if(this.paramData.tel === ''||this.paramData.tel.length !='11'){
					this.btnDisable =true
				}else if(this.paramData.company_name !=''&&this.paramData.address !=''&&this.paramData.concact_person !=''&this.paramData.code !=''){
					this.btnDisable =false
				}
			},
			'paramData.company_name'(newVal){
				if(this.paramData.company_name === ''){
					this.btnDisable =true
				}else if(this.paramData.tel !=''&&this.paramData.address !=''&&this.paramData.concact_person !=''&this.paramData.code !=''){
					this.btnDisable =false
				}
			},
			'paramData.address'(newVal){
				if(this.paramData.address === ''){
					this.btnDisable =true
				}else if(this.paramData.tel !=''&&this.paramData.paramData.company_name !=''&&this.paramData.concact_person !=''&this.paramData.code !=''){
					this.btnDisable =false
				}
			},
			'paramData.concact_person'(newVal){
				if(this.paramData.concact_person === ''){
					this.btnDisable =true
				}else if(this.paramData.company_name !=''&&this.paramData.address !=''&&this.paramData.tel !=''&this.paramData.code !=''){
					this.btnDisable =false
				}
			},
			'paramData.code'(newVal){
				if(this.paramData.code === ''||this.paramData.code.length !='6'){
					this.btnDisable =true
				}else if(this.paramData.company_name !=''&&this.paramData.address !=''&&this.paramData.concact_person !=''&this.paramData.tel !=''){
					this.btnDisable =false
				}
			},
		}
		
	}
</script>
